// 监听性能
export function trackPerformance() {
  if(!this.options.trackPerformance){ return }
  const global = this
  const oldNowTime = new Date().getTime()
  let emptyPoints = 0  // 空白的节点个数
  let whiteLoop = null  // 轮询的计时器
  window.addEventListener('load', () => {
    // 检测白屏的思路就是,如果各个采样点获取到的都是whiteBoxElements数组里的有的,说明只有容器节点.只有容器节点没有内容节点,那就说明是空白页
    sampling()
  })
  // 查看是不是白屏
  function sampling(){
    for (let i = 0; i < 20; i++) {
        const xElement = document.elementFromPoint((window.innerWidth/20)*i,window.innerHeight/2)
        const yElement = document.elementFromPoint(window.innerWidth/2,(window.innerHeight/20)*i)
        if(isContainer(xElement)){ emptyPoints++ }
        if(isContainer(yElement)){ emptyPoints++ }
    }
    const intervalTime =  new Date().getTime() - oldNowTime
    if(emptyPoints === 40){
        emptyPoints = 0
        openWhiteLoop()
        // console.log(intervalTime,'都是容器')
        if(intervalTime > 10000){
            // 白屏时间超过一分钟
            endWhiteLoop(intervalTime)
        }
    }else{
        // console.log(emptyPoints,'没有都是容器')
        endWhiteLoop(intervalTime)
    }
  }
  // 获取采样点是否为容器节点
  function isContainer(element){
    const selector = getSelector(element)
      for (const item of global.options.whiteBoxElements) {
        if(~selector.indexOf(item)){
            return true
        }
      }
      return false
  }
  // 获取dom的名称
  function getSelector(element){
    if (element.id) {
      return '#' + element.id
    } else if (element.className) {
      // div home => .div.home
      return ('.' + element.className.split(' ').filter(item => item).join('.'))
    } else {
      return element.nodeName.toLowerCase()  // DIV转成小写
    }
  }
  // 结束轮询
  function endWhiteLoop(intervalTime){
    clearInterval(whiteLoop)
    whiteLoop = null
    // 白屏都结束了,就一同获取所有性能参数,同时将白屏总时长放到这个对象里
    const entries = performance.getEntries()
    for (const item of entries) {
      if (item.entryType === 'navigation') {
        const obj = {
          DNS: item.domainLookupEnd - item.domainLookupStart,  // DNS查询耗时
          TCP: item.connectEnd - item.connectStart,  // TCP链接耗时
          SSL: item.connectEnd - item.secureConnectionStart,  // SSL安全连接耗时
          request: item.responseEnd - item.responseStart,  // 请求耗时
          domTree: item.domComplete - item.domInteractive,  // 解析dom树耗时
          firstRender: Math.abs(item.responseStart - item.startTime),  // 首次渲染时间.可能会出现开始时间很久,所以要转成正整数
          domready: item.domContentLoadedEventEnd - item.startTime,  // domready时间
          duration: item.duration  // onload时间(总下载时间)
        }
        for (const key in obj) { obj[key] = Math.ceil(obj[key]) }  // 所有值都向上取整
        obj.name = item.name
        obj.type = item.entryType
        obj.whiteScreenTime = intervalTime  // 白屏总时长
        global.sendDataBefore([], 'navigationTime', obj)
      } else if (item.entryType === 'resource') {
        const obj = {
          duration: item.duration,  // 整个过程时间
          DNS: item.domainLookupEnd - item.domainLookupStart,  // DNS查询时间
          TCP: item.connectEnd - item.connectStart,  // TCP三次握手时间(HTTP)
          SSL: item.connectEnd - item.secureConnectionStart,  //  SSL握手时间(HTTPS协议会有SSL握手)
          TTFB: Math.abs(item.responseStart - item.startTime),  // TTFB(首包时间).可能会出现开始时间很久,所以要转成正整数
          response: item.responseEnd - item.responseStart  // 响应时间(剩余包时间)
        }
        for (const key in obj) { obj[key] = Math.ceil(obj[key]) }  // 所有值都向上取整
        obj.name = item.name
        obj.type = item.entryType
        global.sendDataBefore([], 'resourceTime', obj)
      }
    }
  }
  // 开启轮询查看是不是白屏
  function openWhiteLoop(){
      if(whiteLoop){ return }
      whiteLoop = setInterval(function () {
        sampling()
      }, 500)
  }
}
